import 'dart:math';

import 'package:factoryside/utils/utils.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';

class LineChartSample1 extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => LineChartSample1State();
}

class LineChartSample1State extends State<LineChartSample1> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return AspectRatio(
      aspectRatio: 1.23,
      child: Container(
//        decoration: const BoxDecoration(
//          borderRadius: BorderRadius.all(Radius.circular(18)),
//          gradient: LinearGradient(
//            colors: [
//              Color(0xff2c274c),
//              Color(0xff46426c),
//            ],
//            begin: Alignment.bottomCenter,
//            end: Alignment.topCenter,
//          ),
//        ),
        child: Stack(
          children: <Widget>[
            Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                const SizedBox(
                  height: 37,
                ),
                const Text(
                  '发单量：500   完成量：488',
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 16,
                  ),
                  textAlign: TextAlign.center,
                ),
                const SizedBox(
                  height: 4,
                ),
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.only(right: 16.0, left: 6.0),
                    child: LineChart(
                      sampleData(),
                      swapAnimationDuration: const Duration(milliseconds: 250),
                    ),
                  ),
                ),
                const SizedBox(
                  height: 10,
                ),
              ],
            ),
//            IconButton(
//              icon: Icon(
//                Icons.refresh,
//                color: Colors.black.withOpacity(1.0),
//              ),
//              onPressed: () {
//                setState(() {
//
//                });
//              },
//            )
          ],
        ),
      ),
    );
  }

  LineChartData sampleData() {
    return LineChartData(
      lineTouchData: LineTouchData(
        touchTooltipData: LineTouchTooltipData(
            tooltipBgColor: Colors.blueGrey.withOpacity(0.8),
            getTooltipItems: (touchedSpots) {
              return touchedSpots.map((LineBarSpot touchedSpot) {
                final textStyle = TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                  fontSize: 14,
                );
                return LineTooltipItem(
                    '${touchedSpot.y.toInt().toString()}单', textStyle);
              }).toList();
            }),
        touchCallback: (LineTouchResponse touchResponse) {},
        handleBuiltInTouches: true,
      ),
      gridData: FlGridData(
        show: false,
      ),
      titlesData: FlTitlesData(
        bottomTitles: SideTitles(
          showTitles: true,
          reservedSize: 22,
          getTextStyles: (context, value) => const TextStyle(
            color: Colors.black,
            fontWeight: FontWeight.bold,
            fontSize: 16,
          ),
          margin: 10,
          getTitles: (value) {
            switch (value.toInt()) {
              case 0:
                return '周一';
              case 1:
                return '周二';
              case 2:
                return '周三';
              case 3:
                return '周四';
              case 4:
                return '周五';
              case 5:
                return '周六';
              case 6:
                return '周日';
            }
            return '';
          },
        ),
        leftTitles: SideTitles(
          showTitles: true,
          getTextStyles: (context, value) => const TextStyle(
            color: Colors.black,
            fontSize: 11,
          ),
          getTitles: (value) {
            switch (value.toInt()) {
              case 50:
                return '50';
              case 100:
                return '100';
              case 150:
                return '150';
              case 200:
                return '200';
            }
            return '';
          },
          margin: 5,
          reservedSize: 30,
        ),
      ),
      borderData: FlBorderData(
        show: true,
        border: const Border(
          bottom: BorderSide(
            color: Colors.black,
            width: 1,
          ),
          left: BorderSide(
            color: Colors.black,
            width: 1,
          ),
          right: BorderSide(
            color: Colors.transparent,
          ),
          top: BorderSide(
            color: Colors.transparent,
          ),
        ),
      ),
      minX: 0,
      maxX: 6,
      maxY: 200,
      minY: 0,
      lineBarsData: [
        buildLineChartBarData(),
//        buildLineChartBarData(),
//        buildLineChartBarData(),
      ],
    );
  }

  LineChartBarData buildLineChartBarData() {
    List<double> myList = [0, 1, 2, 3, 4, 5, 6];
    return LineChartBarData(
      spots: myList
          .map((element) => FlSpot(element, Random().nextInt(200).toDouble()))
          .toList(),
      isCurved: true,
      colors: [
        colors[0],
      ],
      barWidth: 1,
      isStrokeCapRound: true,
      dotData: FlDotData(
        show: false,
      ),
      belowBarData: BarAreaData(show: true, colors: [Colors.red]),
    );
  }
}
